<{php}>
$content = $query->getCustomerCaseContent($id);
$title = $content->title;
$description = $content->desc;
<{/php}>


<{include file="../template/public/head.html"}>
<link rel="stylesheet" type="text/css" href="/static/css/css.css" />
<script type="text/javascript" src="/static/js/jquery.SuperSlide.2.1.1.js"></script>
<style type="text/css">
    .full {  width: 100%;  height: 100%;  }
    .page-control {  position: absolute;  top: 50%;  width: 56px;  height: 100px;  margin-top: -50px;  }
    .left {  left: 0;  }
    .right {  right: 0; }
    .about-arrow{ font-size: 50px; clip: auto; overflow: visible; }
    .about-arrow img{ opacity: 0.8; }
    .about-arrow img:hover{ opacity: 1; }
    .bg{ background-color: white; border: 1px solid #eaedf2; }
    .pd-0{padding:0;}
    .bottom-banner .imgbox{height:260px;width:340px;}
    .case-white-box{margin:0 auto;margin-bottom:16px;}
    .white{color:white !important;}


</style>
<!-- header-->
<!-- pro_top -->
<{include file="../template/public/union_nav.html"}>


<!--面包屑导航-->
<div class="container-fluid">
    <div class="row bread-nav">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <ol class="breadcrumb pull-left">
                        <li>
                            <a href="/"><{:lang('home')}></a>
                        </li>
                        <li>
                            <a href="<{php}> echo $query->U('index/customer_case/index',true);<{/php}>"><{:lang('project')}></a>
                        </li>
                        <li class="active"><{$content->title}></li>
                    </ol>
                </div>

            </div>
        </div>
    </div>
</div>



<style type="text/css">
    @media (max-width: 1200px) {
        .cases_banner{
            background: url(<{$content->banner}>) no-repeat center center !important;
        }
    }
    @media (max-width:700px) {
        .cases_banner{
            display:none;
        }
        #project img{max-width:100%;height:auto !important;}
    }
</style>

<div class="cases_banner banner" style="background: url(<{$content->banner}>);background-size: 100% 100%;">
    <div class="container">
        <div class="col-sm-7">
            <div class="text">
                <h1><strong class="white"><{$content->cover_title}></strong></h1>
                <p class="white"><{$content->cover_desc}></p>
            </div>
        </div>
    </div>
</div>


<!-- center of the page -->
<div class="case-bg">
    <div id="project" class="case-wrapper">
        <div class="container">
            <div class="case-section">
                <div class="title" style="border-bottom:2px solid #efefef;margin-bottom:30px;">
                    <h2><{$content->title}></h2>
                    <p class="text-center" style=" /*line-height: 60px;*/
"><{$content->desc}></p>
                </div>

                <div>
                    <{$content->content}>
                </div>
            </div>



            <{php}>
                $assocProducts = $query->getAssocProductsForCustomer($id);
                $orginAssocProducts = $assocProducts;
                $assocProducts = array_chunk($assocProducts,3);
            <{/php}>
            <div class="case-section other-case">
                <div class="title">
                    <h2 style="text-align:left"><{:lang('project_the_product')}><span style="margin-left:20px;"><{:lang('projects_pepple_who_browed')}></span></h2>
                </div>
                <!--<div class="case-site">
                    <{volist name="assocProducts" id="part"}>
                    <div class="row">
                        <{if condition="(!empty($part))"}>
                        <{volist name="part" id="item"}>
                        <div class="col-md-4 col-sm-4 col-xs-6 hover-orange" title="<{$item.name}>">
                            <div class="imgbox case-white-box hover-show">
                                <a href="/index/product/product/id/<{$item.id}>"><img src="<{$item.cover}>" alt="<{$item.name}>" class="full" /></a>
                                <p><a href="/index/product/product/id/<{$item.id}>"><{$item.name}></a></p>
                            </div>
                        </div>
                        <{/volist}>
                        <{/if}>
                    </div>
                    <{/volist}>
                </div>-->
            </div>
        </div>
    </div>
</div>


<section class="bottom-banner">
    <div class="container pro-sec">
        <div class="text-center center-block">
            <div class="container  case_list">
                <div class="carousel slide" id="slider1" data-ride="carousel">
                    <div class="carousel-inner picScroll-left1" role="listbox">
                        <div class="item active">
                            <div class="row">

                                <{volist name="orginAssocProducts" id="item"}>
                                <div class="col-md-4 col-sm-4 col-xs-6 border-right-bold hover-fadeIn pd-0" >

                                        <div class="imgbox case-white-box hover-show">
                                            <a href="<{php}> echo $query->U('index/product/product/id/'.$item['id'],true);<{/php}>"><img src="<{$item.cover}>" alt="<{$item.name}>" class="full" /></a>
                                        </div>
                                    <p><a href="<{php}> echo $query->U('index/product/product/id/'.$item['id'],true);<{/php}>"><{$item.name}></a></p>
                                </div>
                                <{/volist}>

                            </div>
                        </div>
                        <div class="hd">
                            <a class="left page-control next" role="button" data-slide="prev"> <span class="about-arrow"><img src="/static/images/arrow_left.jpg" alt="" /> </span> </a>
                            <a class="right page-control prev"  role="button" data-slide="next"> <span class="about-arrow"><img src="/static/images/arrow_right.jpg" alt="" /></span> </a>  </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</section>

<script type="text/javascript">
    jQuery(".picScroll-left1 ").slide({titCell:".hd ul",mainCell:".item .row",autoPage:true,effect:"leftLoop",autoPlay:true,vis:3,trigger:"click"});
</script>

<script src="/static/js/bootstrap.min.js"></script>
<{include file="../template/public/sidebar.html"}>
<{include file="../template/public/foot.html"}>